<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<head th:replace="/common/include :: header(~{::title}, ~{::link}, ~{::style})">
    <title>DEMO-表单-文件上传</title>
    <link th:href="@{/lib/bootstrap-fileinput/fileinput.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/lib/bootstrap-fileinput/explorer-fas/theme.min.css}" rel="stylesheet" type="text/css"/>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>文件上传控件
                        <small>https://github.com/kartik-v/bootstrap-fileinput</small>
                    </h5>
                </div>
                <div class="ibox-content">
                    <div class="form-group">
                        <label class="font-noraml">简单示例</label>
                        <div class="file-loading">
                            <input id="fileinput-demo-1" type="file" data-min-file-count="1" data-max-file-count="1"  data-theme="explorer">
                        </div>
                    </div>

                    <div class="form-group">
                        <label class="font-noraml">多文件上传</label>
                        <div class="file-loading">
                            <input id="fileinput-demo-2" type="file" name="file" multiple>
                        </div>
                    </div>
                    <hr>
                    <div class="form-group">
                        <label class="font-noraml">相关参数详细信息</label>
                        <div><a href="http://doc.ruoyi.vip/#/standard/zjwd?id=jasny-bootstrap" target="_blank">http://doc.ruoyi.vip/#/standard/zjwd?id=jasny-bootstrap</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div th:replace="/common/include :: footer"></div>
<div th:replace="/common/include :: fileinputJs"></div>

<script th:inline="javascript">
    $(function() {
        // 加载上传按钮组件
        $.fileInputPlug.init('fileinput-demo-1');
        $.fileInputPlug.init('fileinput-demo-2', null, {
            minFileCount: 1,
            maxFileCount: 1,
            showUpload: false,
            showDownload: false,
            showBrowse: false,
            initialPreview: [
                ctx + 'image/apple-icon.png'
            ]
        });
    });
</script>
</body>
</html>
